<template>
  <a-modal>
    <a-form
      :model="formState"
      v-bind="layout"
      :rules="rules"
      @finish="onFinish"
    >
      <a-form-item name="name" label="账户">
        <a-input v-model:value="formState.name" />
      </a-form-item>
      <a-form-item name="labTypeId" label="labTypeId">
        <a-input v-model:value="formState.labTypeId" />
      </a-form-item>
      <a-form-item label="experimenterId" name="experimenterId">
        <a-radio-group v-model:value="formState.experimenterId">
          <a-radio :value="0">下头男☹️</a-radio>
          <a-radio :value="1">小仙女🧚‍♀️</a-radio>
          <a-radio :value="2">小仙女2🧚‍♀️</a-radio>
          <a-radio :value="3">小仙女3🧚‍♀️</a-radio>
        </a-radio-group>
        <a-form-item name="deviceNum" label="deviceNum">
          <a-input v-model:value="formState.deviceNum" />
        </a-form-item>
      </a-form-item>
      <a-form-item :wrapper-col="{ ...layout.wrapperCol, offset: 8 }">
        <div class="submitbtn">
          <a-button type="primary" html-type="submit">提交信息</a-button>
        </div>
      </a-form-item>
    </a-form>
  </a-modal>
</template>

<script lang="ts" setup>
import { type ILabInfo } from "@/api/RequestIDL/labManage";
import { ref } from "vue";

interface Props {
  modalShow: boolean;
}
const props = defineProps<Props>();
console.log(props);

const layout = {
  labelCol: { span: 8 },
  wrapperCol: { span: 8 },
};
const rules = ref([]);
const formState = ref<Partial<ILabInfo>>({
  name: "",
  labTypeId: undefined,
  experimenterId: undefined,
  deviceNum: undefined,
});
const onFinish = () => {};
</script>
<style scoped lang="scss">
/* @import url(); 引入css类 */
</style>
